<template>
  <div v-show="isStudent">
    <h1>学生注册</h1>
    <el-form ref="loginForm" :model="studentRegisterForm" label-width="100px" status-icon>
      <el-form-item label="学号" prop="account">
        <el-input v-model="studentRegisterForm.account" auto-complete="off" placeholder="请输入账号"></el-input>
      </el-form-item>
      <el-form-item label="密码" prop="password">
        <el-input v-model="studentRegisterForm.password" auto-complete="off" placeholder="请输入密码"
                  type="password"></el-input>
      </el-form-item>
      <el-form-item label="再次输入密码" prop="password">
        <el-input v-model="studentRegisterForm.rePassword" auto-complete="off" placeholder="请再一次输入密码"
                  type="password"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="studentRegister(studentRegisterForm)">注册</el-button>
        <el-button type="primary" @click="router.push({ name: 'login'})">去登陆</el-button>
        <el-button typeof="info" @click="isStudent = !isStudent">切换为{{ switchSpan }}注册</el-button>
      </el-form-item>
    </el-form>
  </div>
  <div v-show="!isStudent">
    <EnterpriseRegister @changeUserType="switchUserType"></EnterpriseRegister>
  </div>
</template>

<script lang="ts" setup>
import {reactive, ref} from "vue";
import type {ResponseInterface, StudentRegisterDTO} from "@/model/type";
import {ElMessage} from "element-plus";
import {studentRegisterAPI} from "@/api/UserAPI";
import router from "@/router";
import EnterpriseRegister from "@/components/register/EnterpriseRegister.vue";

let studentRegisterForm = reactive<StudentRegisterDTO>({rePassword: "", account: "", password: "", userType: "student"})
let isStudent = ref<boolean>(true);
let switchSpan = ref<string>(isStudent ? "企业" : "学生");

async function studentRegister(user: StudentRegisterDTO) {
  user.userType = "student";
  if (user.account.length == 0) {
    ElMessage.error("学号不能为空");
    return;
  }
  if (user.password != user.rePassword) {
    ElMessage.error("两次密码不一致");
    return;
  }
  let r: ResponseInterface = await studentRegisterAPI(user);
  if (r.code == 200) {
    ElMessage.success("注册成功");
    await router.push({path: "/login"})
  } else {
    ElMessage.error(r.msg);
  }
}

function switchUserType(isStudent_: boolean) {
  isStudent.value = isStudent_
}
</script>

<style scoped>

</style>